// 获取表单中的内容
let searchText = document.querySelector("#search-text")
let searchButton = document.querySelector("#search-button")
let mainLoading = document.querySelector("#main-loading")

// http://yinhj.top
// 收集调用的数据
let resultData = {}
    // 请求数据
searchButton.addEventListener("click", () => {
    console.log(`点击了`)
    mainLoading.classList.remove("none")
    let uLdetailsH4 = document.querySelector(".ul-details").innerHTML
    $.ajax({
        url: 'http://172.16.9.249:8000/wts/websiteCheck/api/sendData',
        type: 'post',
        data: `{ "website_url": "${searchText.value}" }`,
        async: true,
        timeout: 20000,
        success: (data, status) => {
            console.log(`请求成功`)
            mainLoading.classList.add("none")
            resultData = JSON.parse(data)
            if (resultData.notes.length >= 1) {
                renderingResult(resultData)
            } else {
                uLdetailsH4 = `该网站没有使用53代码`
                    // alert(`该网站没有使用53代码`)
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            if (textStatus === 'timeout') {
                uLdetailsH4 = `请求超时`
                    // console.log('请求超时');
            } else if (textStatus === 'abort') {
                uLdetailsH4 = `请求被中止`
                    // console.log('请求被中止');
            } else if (textStatus === 'error') {
                uLdetailsH4 = `发生未知错误`
                console.log('发生未知错误');
            } else {
                uLdetailsH4 = '其他错误：' + textStatus
                    // console.log('其他错误：' + textStatus);
            }
            mainLoading.classList.add("none")
        }
    })
})

// 键盘事件
searchText.addEventListener("keyup", function(e) {
    if (e.keyCode === 13) searchButton.click()
})
let arg = document.querySelector("#arg")

// 渲染函数
function renderingResult(resultData) {
    // 分解resultData中的对象
    let { website_info } = resultData;
    // 分解website_info中的对象
    let { host, arg, style, test_link } = website_info;

    // 打印代码详情
    let ulDetails = document.querySelector("#ul-details")

    ulDetails.innerHTML = `<li>
        <p>添加53代码</p>
        <img src="../images/yes.png" alt="">
    </li>
    <li>
        <p>使用固定链接</p>
        <img src="../images/no.png" alt="">
    </li>
    <li>
        <p>公司站点</p>
        <img src="../images/no.png" alt="">
    </li>
    <li>
        <p>当前有客服在线</p>
        <img src="../images/yes.png" alt="">
</li>`;

    // 打印挂码信息
    let tableDetails = document.querySelector("#table-details")
    tableDetails.innerHTML =
        `<tr>
            <th>功能名称</th>
            <th>返回值</th>
            <th>功能名称</th>
            <th>返回值</th>
        </tr>
        <tr>
            <td>分组域名</td>
            <td>${host}</td>
            <td>固定链接地址</td>
            <td>
                <a href="https://tb.53kf.com/code/client/${arg}/${style}">
                https://tb.53kf.com/code/client/${arg}/${style}
                </a>
            </td>
        </tr>
        <tr>
            <td>网站风格</td>
            <td>${style}</td>
            <td>挂码链接地址</td>
            <td>
            <a href="https://tb.53kf.com/code/code/${arg}/${style}">
            https://tb.53kf.com/code/code/${arg}/${style}
            </a>
               
            </td>
        </tr>
        </tr>
        <tr>
            <td>arg</td>
            <td id="arg">${arg}</td>
            <td>测试链接地址</td>
            <td>
                <a href="${test_link}">
                ${test_link}
            </a>
            </td>
        </tr>`;
}


// function sendData() {
//     var link_input_box_value = document.getElementById("link_input_box").value;

//     $.post("api/seanData", { "website_url": link_input_box_value }, function(data, status) {
//         // 在这里处理返回的数据
//         console.log(status);
//         console.log(data);
//     });
// }


// // ajax
// $.ajax({
//     url: `../`,
//     type: 'get', // 调用post方法类型
//     dataType: 'get',
//     contentType: 'application/json,charset=utf-8', //设置请求头，入参为JSON格式
//     data: JSON.stringify({ 'wanted_code': wanted_code, 'wanted_man_name': wanted_man_name }), // 传参，并序列化
//     async: false, // false-异步
//     beforeSend: function() {
//         // $("#show").html('通缉中...');
//         $("#loading").attr({ "hidden": false });
//     }, // beforeSend 调用前页面展示内容
//     success: function(result) {
//             $("#show").html('流水号：' + result + '，通缉完成');
//             $("#loading").attr({ "hidden": true });
//         } // success 异步调用成功后在页面填充内容
// });